<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			.a{
				width : 200px;
				height : 200px;
				background-color : #666;
			}
		</style>
	</head>
	<body>
		<div id='box' class="a">box</div>
	</body>
</html>
<script>
	
	// class特殊在它是重要的关键字，因此使用 className 代替
	let oBox = document.getElementById('box');
	
	console.log(oBox.class); //undfined
	console.log(oBox.className); //a
	
	//设置
	oBox.className = 'b'; //b
	console.log(oBox.className); //a
	
	//添加
	oBox.className = 'a b'; // a b
	console.log(oBox.className); //a
	oBox.classList.add('b'); //a b
	console.log(oBox.className); //a
	
	//删除
	oBox.classList.remove('b');
	console.log(oBox.className); //a
	
</script>